<script lang="ts" setup>
import arrowRight from '@/static/images/sys/arrow-right.png'
import messageIcon from '@/static/images/tool/message-icon.png'
import commentIcon from '@/static/images/tool/comment-icon.png'
import communicationIcon from '@/static/images/tool/communication-icon.png'
import demandIcon from '@/static/images/tool/demand-icon.png'
import UseBtn from '@/components/use-btn/index.vue'
import useLogin from '@/hooks/useLogin'
import { useUserStore } from '@/store/user'
import { LOGIN_PAGE } from '@/models/sys'

const { ...callback } = useLogin()

const { ...storeCallback } = useUserStore()

function refresh() {
  console.log('触发')
}

function pullRefresh() {}

const list = [
  { title: '群回复统计', icon: messageIcon, path: '/pages/statistics/messageStatistics' },
  // { title: '批量发送', icon: sendIcon, path: '' },
  { title: '好评采集', icon: commentIcon, path: '/pages/comment/commentPage' },
  // { title: '智能值守', icon: onDutyIcon, path: '' },
  // { title: '沟通历史', icon: communicationIcon, path: '/pages/history/historyPage' },
  { title: '沟通历史', icon: communicationIcon, path: '/pages/comment/parentListPage' },
  { title: '需求反馈', icon: demandIcon, path: '/pages/feedback/feedbackPage' },
]

function onItemClick(path: string) {
  if (path !== undefined) {
    uni.navigateTo({
      url: path,
    })
  }
}

function logout() {
  uni.showModal({
    title: '提示',
    content: '是否退出登录？',
    cancelText: '取消',
    confirmText: '确认',
    success: function (res) {
      if (res.confirm) {
        callback.logout(() => {
          storeCallback.clearUserInfo()
          uni.reLaunch({
            url: LOGIN_PAGE,
          })
        })
      }
    },
  })
}

defineExpose({
  refresh,
  pullRefresh,
})
</script>

<template>
  <view style="position: relative; min-height: 100%; padding: 32rpx">
    <view
      style="top: 0"
      class="linear-hor round-corners mt-2"
      v-for="(item, index) in list"
      :key="index"
      @click="onItemClick(item.path)"
    >
      <wd-img :src="item.icon" :width="20" :height="20"></wd-img>
      <span style="margin-right: 24rpx" />
      <wd-text :text="item.title" size="14" color="#2B2F36"></wd-text>
      <span class="spacer" />
      <wd-img :src="arrowRight" :width="20" :height="20"></wd-img>
    </view>
    <view style="position: absolute; bottom: 150rpx; width: calc(100% - 64rpx)">
      <UseBtn content="退出登录" @click="logout"></UseBtn>
    </view>
  </view>
</template>

<style lang="scss" scoped>
.round-corners {
  background: white;
  border-radius: 16rpx;
}

.linear-hor {
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 32rpx;
}

.spacer {
  flex-grow: 1;
}
</style>
